<!DOCTYPE html>
<html lang="en">
<!-- MAIN HEADER -->
<div th:fragment="navigation">
	<!-- container -->
	<div class="container" id="header" >
		<!-- row -->
		<div class="row">
			<!-- LOGO -->
			<div class="col-md-2">
				<div class="header-logo">
					<a href="#" class="logo">
						<img src="static/img/logo.png" alt="">
					</a>
				</div>
			</div>
			<!-- /LOGO -->
			
			<!-- ACCOUNT -->
			<div class="col-md-8 clearfix pull-right">
				<div class="header-ctn">
					<!-- MyStore Info  -->
					<div>
						<a href="#home" src="/storeHomeUrl?storeId=1" class="visitor">
							<i class="fa fa-home"></i>
							<span>我的店铺</span>
						</a>
					</div>
					<!-- / MyStore Info  -->
					<!-- New Product Pubulish -->
					<div>
						<a href="#publish" class="visitor">
							<i class="fa fa-plus"></i>
							<span>新品发布</span>
							<!-- <div class="qty">2</div> -->
						</a>
					</div>
					<!-- /New Product Pubulish -->
					<!-- Employer Manage -->
					<div>
						<a href="#group" class="visitor">
							<i class="fa fa-group"></i>
							<span>员工管理</span>
							<!-- <div class="qty">2</div> -->
						</a>
					</div>
					<!-- /Employer Manage -->
					<!-- Product Manage -->
					<div>
						<a href="#product" class="visitor">
							<i class="fa fa-th-large"></i>
							<span>产品管理</span>
							<!-- <div class="qty">2</div> -->
						</a>
					</div>
					<!-- /Product Manage -->
					<!-- Store Activity -->
					<div>
						<a href="#activity" class="visitor">
							<i class="fa fa-bullhorn"></i>
							<span>活动通告</span>
							<div class="qty">2</div>
						</a>
					</div>
					<!-- /Store Activity -->
					<!-- Menu Toogle -->
					<div>
						<a href="#order" class="visitor">
							<i class="fa fa-list"></i>
							<span>历史订单</span>
							<div class="qty">2</div>
						</a>
					</div>
					
				</div>
			</div>
			<!-- /ACCOUNT -->
		</div>
		<!-- row -->
	</div>
	<script type="text/javascript">
	 
	 
	 jQuery(function($){
		  $('.visitor').click(function(){
			  var url = $(this).attr('src');
			  var id = $(this).attr('href').replace("#","");
			  var tabs = $(".tab-content");
			  var childdren = $(tabs).children('.tab-pane');
			  for(i = 0; i < childdren.length;i ++){
				  var tid = $(childdren[i]).attr('id');
				  if(tid == id){
					  $("#"+tid).addClass('in active');
					  console.log("id in :"+tid+" url="+url); 
					  if(url && ""!=url){
						  console.log("url:"+url);
						  $.ajax({
					            url: url,
					            type: 'get',
					            beforeSend:function (){  
					            	//showLoading(load);
					            },
					            success: function (data) {
					                $('#home').html(data);
					            },
					            error: function (e, jqxhr, settings, exception){
					            	//alert(">>>"+e);
					            }
					         }); 
				  	  }
				  }else{
					  $("#"+tid).removeClass('in active');
					  console.log("id out :"+tid); 
				  }
			  }
		  });
	 });
	</script>
	<!-- container -->
</div>
</html>